<template>
    <!-- 自定义错误页面 -->
    <div class="error-container">
        <div class="info">
            <div class="code">{{ error.statusCode }}</div>
            <div v-if="error.statusCode == 404" class="desc">{{ $t('common.errorMsg1') }}</div>
            <div v-else class="desc">{{ $t('common.errorMsg2') }}</div>
            <el-button @click="$router.replace(localePath('/home'))">{{ $t("order.returnHome") }}</el-button>
        </div>
    </div>
</template>
  
<script>
export default {
    props: ['error'],
    // layout: 'blog' // you can set a custom layout for the error page
}
</script>
<style lang="scss" scoped>
.error-container {
    background-color: #55aafe;
    height: 100vh;
    display: flex;
    .info {
        margin: auto;
        color: #fff;
        text-align: center;
        .code {
            font-size: 200px;
            font-weight: bold;
        }
        .desc{
            font-size: 30px;
            margin: 20px 0;
        }
    }
}
</style>